<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			body{
				background: black;
				height:800px;
			}
			div{
				font:bold 100px/100px "微软雅黑";
				height:100px;
				color:rgba(255,255,255,0.4);
				background: -webkit-linear-gradient(left,
					rgba(255,255,255,0) 0px,
					rgba(255,255,255,0.5) 200px,
					rgba(255,255,255,0.8) 240px,
					rgba(255,255,255,0.8) 280px,
					rgba(255,255,255,0.5) 320px,
					rgba(255,255,255,0) 500px
				) no-repeat -500px 0px;
				-webkit-background-clip: text;	
			}
			@keyframes run{
				100%{
					background-position: 1000px 0px;
				}
			}
			body:hover div{
				animation: 2s run;
			}
		</style>
	</head>
	<body>
		<div>后盾网人人做后盾</div>
	</body>
</html>
